<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>后台登录</title>
    <meta name="author" content="DeathGhost">
    <link rel="stylesheet" type="text/css" href="../../plugin/bootstrap/css/bootstrap.min.css"
          tppabs="css/style.css">

    <link rel="stylesheet" type="text/css" href="css/style.css" tppabs="css/style.css">

    <style>
        body {
            height: 100%;
            background: #16a085;
            overflow: hidden;
        }

        canvas {
            z-index: -1;
            position: absolute;
        }
    </style>
    <script src="../../plugin/jquery/jquery.min.js"></script>
    <script src="../../plugin/jquery/jquery.form.js"></script>
    <script src="../../plugin/bootstrap/js/bootstrap.min.js"></script>
    <script src="../../plugin/bootstrap/js/bootbox.min.js"></script>
    <script src="js/verificationNumbers.js" ></script>
    <script src="js/Particleground.js" ></script>


    <script>
        $(document).ready(function () {
            //粒子背景特效
            $('body').particleground({
                dotColor: '#5cbdaa',
                lineColor: '#5cbdaa'
            });
            //验证码
            createCode();
            //测试提交，对接程序删除即可
            $(".submit_btn").click(function () {
                location.href = "javascrpt:;"/*tpa=http://***index.html*/;
            });
        });
    </script>

    <script>

        function login() {


            var option = {


                success: function (data) {

                    if (data.success) {
                        bootbox.alert({
                            message: data.msg,
                            callback: function () {
                                //跳转
                                window.location.href="../index.html";

                            }
                        })


                    }else{
                        bootbox.alert({
                            message: data.msg,
                            callback: function () {
                            }
                        })
                    }
                }

            };
            $('#loginForm').ajaxSubmit(option);
        }

    </script>
</head>
<body>
<canvas class="pg-canvas" width="1920" height="870"></canvas>

<form action="../../j_spring_security_check" method="post" id="loginForm">
    <dl class="admin_login" style="width: 400px">
        <dt>
            <strong>hhm spring</strong>
            <em>登陆界面</em>
        </dt>
        <div class="form-group">

            <div class="input-group">
                <span class="input-group-addon">u</span>
                <input type="text" class="form-control" placeholder="用户名" value="admin" name="username">
            </div>
        </div>

        <div class="form-group">

            <div class="input-group">
                <span class="input-group-addon">p</span>
                <input type="text" class="form-control" placeholder="密码" value="admin" name="password">
            </div>
        </div>
        <div class="form-group">
            <div class="input-group">
                <span class="input-group-addon">n</span>

                <input type="text" id="J_codetext" placeholder="验证码" maxlength="4" class="form-control">
                <span class="input-group-btn">
        <button class="btn btn-default" type="button" onclick="validate();">验证码核验</button>
                </span>


            </div>

        </div>

        <div class="form-group">
            <dd>
                <canvas class="J_codeimg" id="myCanvas" onclick="createCode()"
                        style="width: 85px;height: 36px">
                    对不起，您的浏览器不支持canvas，请下载最新版浏览器!
                </canvas>
            </dd>
        </div>

        <div class="form-group">
            <dd>
                <input type="button" value="立即登陆" class="submit_btn" onclick="login()">
            </dd>
        </div>
        <dd>
            <p>© 2015-2016 hhm 版权所有</p>

            <p>hhm spring</p>
        </dd>
    </dl>
</form>

</body>
</html>